<!DOCTYPE html>
<head>
<title>Image link in the presence of inline continuations</title>
<script>
if (window.testRunner)
    testRunner.dumpAsText();
</script>
</head>
<body>

<h2>Image link in the presence of inline continuations</h2>

<p>This test checks that a block inside a link does not unduly disturb
  the render tree via inline continuations. In particular, it checks
  that adding &lt;div role=presentation> between a link and its
  contained image does not alter the accessibility tree at all, other
  than with respect to size.</p>

  <div id="plain">
    <a href="http://www.wowhead.com/?item=33924"><img alt="Delicious cake" src="resources/cake.png"></a>
  </div>

  <div id="with-div">
    <a href="http://www.wowhead.com/?item=33924"><div role="presentation"><img alt="Delicious cake" src="resources/cake.png"></div></a>
  </div>

<pre id="result"></div>

<script>
function axTree(elt)
{
    var result = elt.allAttributes() + "\n\n";
    var count = elt.childrenCount;
    for (var i = 0; i < count; ++i) {
        result += "Child " + i + ":\n" + axTree(elt.childAtIndex(i));
    }
    return result;
}

if (window.accessibilityController) {
    var result = document.getElementById("result");
    document.getElementById("plain").focus();
    var plainResult = axTree(accessibilityController.focusedElement);
    plainResult.replace(/AXSize.*\n/g, "");

    document.getElementById("with-div").focus();
    var withDivResult = axTree(accessibilityController.focusedElement);
    withDivResult.replace(/AXSize.*\n/g, "");

    if (plainResult == withDivResult) {
        result.innerHTML = "PASS: accessibility trees were identical other than size."
    } else {
        result.innerHTML = "FAIL: accessibility trees differ.\nPlain image link: \n" + plainResult + "\nWith presentation div:\n" + withDivResult;
    }
}
</script>
</body>
